<template>
  <view :class="['container', { dark: theme == 'dark' }]">
    <view :class="['top1', { dark: theme == 'dark' }]">
      <view class="flex t1">
        <view class="flex t1left logoTitle">
          <!-- <image :src="theme=='dark' ? '/static/images/bico2.png' : '/static/images/bico1.png'" class="flex_image3"></image> -->
          Home
        </view>

        <view class="flex">
          <image
            @click="skip"
            :src="theme == 'dark' ? '/static/images/lang2.png' : '/static/images/lang1.png'"
            class="flex_image4"
            style="margin-right: 30rpx"
          ></image>
          <image
            @click="gocontact"
            :src="theme == 'dark' ? '/static/images/kf2.png' : '/static/images/kf1.png'"
            class="flex_image4"
          ></image>
        </view>
      </view>
    </view>
    <!-- <view class="fixed my_layer pos_l0b0 w100 ht100" v-if="isShowLayer" @tap="isShowLayer=false;">
				<view class="fixed pos_l10b50 bgHeader w85 pt20 pb10 plr10" @tap.stop>
					<view v-if="homenews.length" v-html="homenews[0].content"></view>
				</view>
		</view> -->
    <view :class="['top', { dark: theme == 'dark' }]">
      <view class="totalViewTop">
        <view class="totalView">
          <view class="totalText">{{ $t('home.total_money') }}</view>
          <text
            v-if="eyesFlag"
            class="iconfont icon-yanjing2"
            @click="eyesFlag = false"
          ></text>
          <text
            v-else
            class="iconfont icon-yanjing3"
            @click="eyesFlag = true"
          ></text>
        </view>
        <view class="totalView">
          <image
            :src="
              theme == 'dark'
                ? '../../static/images/usdtLogo.png'
                : '../../static/images/usdtLogo.png'
            "
            class="flex_image23"
          ></image>
          <view class="botalNumView2">{{ eyesFlag ? totalPrice : '******' }} </view>
        </view>
        <view class="totalView">
          <view
            class="botalNumView1"
            style="display: flex"
          >
            <image
              class="fallDrastically"
              :src="
                parseFloat(incomeTotal) < 0
                  ? '../../static/image/fallDrastically1.png'
                  : '../../static/image/fallDrastically2.png'
              "
            ></image>

            <text :class="['t3ItemM2', parseFloat(incomeTotal) < 0 ? 'orange' : 'green']"
              >{{ eyesFlag ? (incomeTotal <= 0 ? incomeTotal : '+' + incomeTotal) : '******' }}$
            </text>
            <text class="today">{{ $t('home.today') }}</text>
          </view>
        </view>
        <view class="totalView">
          <view class="btnview">
            <view
              class="bbtn bbtn1"
              @click="funsItemClick(13)"
            >
              <image
                src="../../static/image/riseIcon.png"
                class="flex_image24"
              ></image>

              <view
                :style="{
                  color: '#fff'
                }"
                >{{ $t('home.linkdeposit') }}</view
              >
            </view>
            <view
              class="bbtn bbtn2"
              @click="funsItemClick(12)"
            >
              <image
                src="../../static/image/addIcon.png"
                class="flex_image24"
              ></image>

              <view
                :style="{
                  color: '#fff'
                }"
                >{{ $t('home.buycoin') }}</view
              >
            </view>
          </view>
        </view>
      </view>

      <!-- 3D 新版轮播图开始 -->
      <view
        class="wrap2"
        style="margin-top: 40rpx"
      >
        <u-swiper
          :list="bannerList"
          @click="bannerclick"
          bg-color="#22253c00"
          name="img"
          mode="round"
          height="280"
          effect3d-previous-margin="0"
          border-radius="10"
          :effect3d="true"
          indicator-pos="bottomCenter"
        >
        </u-swiper>
      </view>

      <!-- 新版轮播图结束 -->

      <!-- 公告 -->
      <!-- <view class="lind">
				<view class="flex lindBox" @click="toAdv">
					<image :src="theme=='dark' ? '../../static/ico/gfgg2.png' : '../../static/ico/gfgg.png'" class="flex_image22"></image>
					<swiper style="width: 100%;height: 40rpx;" :vertical="true" :autoplay="true" :interval="3000"
						:circular="true">
						<swiper-item class="flex alcenter" v-for="(item,i) in noticeList" :key="i">
							<view class="lindText">{{item.title}}</view>
						</swiper-item>
					</swiper>
					<view class="wtr0_lin">
					<image :src="theme=='dark' ? '/static/image/dian2.png' : '/static/image/dian1.png'" class="flex_image222"></image>
					</view>
				</view>
			</view> -->
      <!-- <view class="popularTitle"> Coins </view>
      <view class="popular">
        <view
          class="t3Item t3ItemLeft t3"
          v-for="(item, i) in (current != 1 ? quoList : recomList).slice(0, 10)"
          :key="item.symbol"
          @click="linkKline(current == 1 ? 1 : 0, item.symbol)"
        >
          <view class="left">
            <view
              class="t3ItemSymbol"
              :style="{
                color: theme == 'dark' ? '#e2e2e2' : '#979CA6'
              }"
              >{{ item.symbol }}
              <image
                class="fallDrastically"
                :src="
                  parseFloat(item.rose) < 0
                    ? '../../static/image/fallDrastically1.png'
                    : '../../static/image/fallDrastically2.png'
                "
              ></image>
              <span :class="['t3ItemM2', parseFloat(item.rose) < 0 ? 'orange' : 'green']"
                >{{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}</span
              >
            </view>

            <view
              :class="['t3ItemM1']"
              :style="{
                color: theme == 'dark' ? '#e2e2e2' : '#121212'
              }"
              >${{ item.close }}</view
            >
            <view
              v-if="false"
              class="t3ItemM3"
              >≈ {{ item.cny }} CNY</view
            >
          </view>

          <view class="right">
            <image
              :src="item.img"
              mode=""
            />
          </view>
        </view>
      </view> -->

      <!-- <view class="toptf" @click="showMid" v-if="bannerMid.length">
				
				<view class="t3 tf3">
					<u-image  width="100%" height="150rpx" :src="bannerMid[0].img" border-radius="4" bg-color="#02072300">
						<u-loading slot="loading"></u-loading>
					</u-image>
				</view>
			</view> -->
    </view>
    <!-- 导航 A -->

    <view>
      <u-grid
        :col="5"
        :border="false"
        v-if="!ismore"
      >
	  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(77)">
	    <view class="botBoxItem" @click="funsItemClick(77)">
	    	<image
	    	  :src="theme == 'dark' ? '/static/ico/zc22.png' : '/static/ico/zc22.png'"
	    	  class="flex_image2"
	    	></image>
	    	<view class="grid-text">{{ $t('bico.W502') }}</view>
	    </view>
	  </u-grid-item>
	  
	  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(1)">
	    <view class="botBoxItem" @click="funsItemClick(1)">
			<image
			  :src="theme == 'dark' ? '/static/ico/gg22.png' : '/static/ico/gg22.png'"
			  class="flex_image2"
			></image>
			<view class="grid-text">{{ $t('bico.W503') }}</view>
		</view>
	  </u-grid-item>
	  
	  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(3)">
	    <view class="botBoxItem" @click="funsItemClick(3)">
	    	<image
	    	  :src="theme == 'dark' ? '/static/ico/cb22.png' : '/static/ico/cb22.png'"
	    	  class="flex_image2"
	    	></image>
	    	<view class="grid-text">{{ $t('bico.W504') }}</view>
	    </view>
	  </u-grid-item>
	  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(4)" >
	    <view class="botBoxItem" @click="funsItemClick(4)">
			<image
			  :src="theme == 'dark' ? '/static/ico/tb22.png' : '/static/ico/tb22.png'"
			  class="flex_image2"
			></image>
			<view class="grid-text">{{ $t('bico.W505') }}</view>
	    </view>
	  </u-grid-item>
	  
	  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(2)" >
	    <view class="botBoxItem" @click="funsItemClick(15)">
	    	<image
			  :src="theme == 'dark' ? '/static/ico/aq22.png' : '/static/ico/aq22.png'"
	    	  class="flex_image2"
	    	></image>
	    	<view class="grid-text">{{ $t('bico.W506') }}</view>
	    </view>
	  </u-grid-item>
      <!--  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(15)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/fbjy2.png' : '/static/ico/fbjy1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c3') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 每日签到 -->
       <!-- <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(23)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/qd2.png' : '/static/ico/qd1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c8') }}</view>
          </view>
        </u-grid-item>

        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(11)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/hz2.png' : '/static/ico/hz1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('home.chongbi3') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 邀请好友 -->
       <!-- <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(26)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/nyq2.png' : '/static/ico/nyq1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c7') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 资产 -->

     <!--   <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(19)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/zc2.png' : '/static/ico/zc1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c11') }}</view>
          </view>
        </u-grid-item>
        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(14)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/sb2.png' : '/static/ico/sb1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c4') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 星链矿机 -->
        <!-- <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(22)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/wk2.png' : '/static/ico/wk1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c5') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 用户闪付 -->
      <!--  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(21)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/sd2.png' : '/static/ico/sd1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c6') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 闪兑 -->
        <!-- <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(25)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/s2.png' : '/static/ico/s1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('home.flash') }}</view>
          </view>
        </u-grid-item> -->

        <!-- 展开更多 -->
        <!-- <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="changemore(true)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/more2.png' : '/static/ico/more1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('home.more') }}</view>
          </view>
        </u-grid-item> -->
      </u-grid>
    </view>

    <!-- 更多导航111111111111111111111111111111111111111111111111111111111111 -->
    <view v-if="ismore">
      <u-grid
        :col="5"
        :border="false"
      >
		  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(77)">
			<view class="botBoxItem" @click="funsItemClick(77)">
				<image
				  :src="theme == 'dark' ? '/static/ico/zc22.png' : '/static/ico/zc22.png'"
				  class="flex_image2"
				></image>
				<view class="grid-text">{{ $t('bico.W502') }}</view>
			</view>
		  </u-grid-item>
		  
		  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(1)">
			<view class="botBoxItem" @click="funsItemClick(1)">
					<image
					  :src="theme == 'dark' ? '/static/ico/gg22.png' : '/static/ico/gg22.png'"
					  class="flex_image2"
					></image>
					<view class="grid-text">{{ $t('bico.W503') }}</view>
				</view>
		  </u-grid-item>
		  
		  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(3)">
			<view class="botBoxItem" @click="funsItemClick(3)">
				<image
				  :src="theme == 'dark' ? '/static/ico/cb22.png' : '/static/ico/cb22.png'"
				  class="flex_image2"
				></image>
				<view class="grid-text">{{ $t('bico.W504') }}</view>
			</view>
		  </u-grid-item>
		  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(4)" >
			<view class="botBoxItem" @click="funsItemClick(4)">
					<image
					  :src="theme == 'dark' ? '/static/ico/tb22.png' : '/static/ico/tb22.png'"
					  class="flex_image2"
					></image>
					<view class="grid-text">{{ $t('bico.W505') }}</view>
			</view>
		  </u-grid-item>
		  
		  <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]" @click="funsItemClick(2)" >
			<view class="botBoxItem" @click="funsItemClick(15)">
				<image
					  :src="theme == 'dark' ? '/static/ico/aq22.png' : '/static/ico/aq22.png'"
				  class="flex_image2"
				></image>
				<view class="grid-text">{{ $t('bico.W506') }}</view>
			</view>
		  </u-grid-item>
        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(15)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/fbjy2.png' : '/static/ico/fbjy1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c3') }}</view>
          </view>
        </u-grid-item>

        <!-- 每日签到 -->
        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(23)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/qd2.png' : '/static/ico/qd1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c8') }}</view>
          </view>
        </u-grid-item>

        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(11)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/hz2.png' : '/static/ico/hz1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('home.chongbi3') }}</view>
          </view>
        </u-grid-item>

        <!-- 邀请好友 -->
        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(26)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/nyq2.png' : '/static/ico/nyq1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c7') }}</view>
          </view>
        </u-grid-item>

        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(12)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/tb2.png' : '/static/ico/tb1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('ieo.buycoin') }}</view>
          </view>
        </u-grid-item>
        <!-- 用户闪付 -->
        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(21)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/sd2.png' : '/static/ico/sd1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('login.c6') }}</view>
          </view>
        </u-grid-item>
        <!-- 资讯 -->
        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="funsItemClick(18)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/yq2.png' : '/static/ico/yq1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('ieo.news') }}</view>
          </view>
        </u-grid-item>
        <!-- 充币 -->
        <u-grid-item
          v-if="false"
          :class="['flex', 'botBox', { darksss: theme == 'dark' }]"
        >
          <view
            class="botBoxItem"
            @click="funsItemClick(13)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/czbz2.png' : '/static/ico/czbz1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('home.chongbi1') }}</view>
          </view>
        </u-grid-item>
        <!-- 买币 -->
        <u-grid-item
          v-if="false"
          :class="['flex', 'botBox', { darksss: theme == 'dark' }]"
        >
          <view
            class="botBoxItem"
            @click="funsItemClick(12)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/tb2.png' : '/static/ico/tb1.png'"
              class="flex_image2"></image>
            <view class="grid-text">{{ $t('ieo.buycoin') }}</view>
          </view>
        </u-grid-item>

        <u-grid-item :class="['flex', 'botBox', { darksss: theme == 'dark' }]">
          <view
            class="botBoxItem"
            @click="changemore(false)"
          >
            <image
              :src="theme == 'dark' ? '/static/ico/more2.png' : '/static/ico/more1.png'"
              class="flex_image2"
            ></image>
            <view class="grid-text">{{ $t('home.more') }}</view>
          </view>
        </u-grid-item>
      </u-grid>
    </view>
    <!-- 更多导航结束 -->
    <!-- <view class="flex mid">
			<view class="midRight">
				<view :class="['flex','midRightTop',{'darksss':theme == 'dark'}]"  @click="funsItemClick(17)">
					<image class="image2" src="../../static/images/c1.png" mode=""></image>
					<view>
						<view class="midRightText1">{{$t('login.c9')}}</view>
						<view class="midRightText2">{{$t('login.c10')}}</view>
					</view>
				</view>
				<view :class="['flex','midRightBottom',{'darksss':theme == 'dark'}]" @click="funsItemClick(19)">
					<image class="image3" src="../../static/images/c3.png" mode=""></image>
					<view<view >
						<view class="midRightText1">{{$t('login.c11')}}</view>
						<view class="midRightText2">{{$t('login.c12')}}</view>
					</view>
				</view>
			</view>
			
			<view class="midRight">
				<view :class="['flex','midRightTop',{'darksss':theme == 'dark'}]" @click="funsItemClick(16)">
					<image class="image2" src="../../static/images/c0.png" mode=""></image>
					<view>
						<view class="midRightText1">{{$t('login.c13')}}</view>
						<view class="midRightText2">{{$t('login.c14')}}</view>
					</view>
				</view>
				
				<view :class="['flex','midRightBottom',{'darksss':theme == 'dark'}]" @click="funsItemClick(20)">
					<image class="image3" src="../../static/images/c2.png" mode=""></image>
					<view >
						<view class="midRightText1">DeFi</view>
						<view class="midRightText2">{{$t('login.c16')}}</view>
					</view>
				</view>
			</view>
			
		</view> -->

    <!-- <view class="mid1">
      <view class="mid1Item">
        <view
          class="item"
          @click="funsItemClick(19)"
        >
          <image
            class="image2"
            src="../../static/images/c3.png"
            mode=""
          ></image>

          <view class="textBox">
            <view
              :style="{
                color: '#121212'
              }"
              >{{ $t('login.c11') }}</view
            >
            <view
              style="margin-top:25upx;color: #999;
    font-size: 12px;
}"
              >{{ $t('login.c12') }}</view
            >
          </view>
        </view>
        <view
          class="item"
          @click="funsItemClick(17)"
        >
          <image
            class="image2"
            src="../../static/images/c1.png"
            mode=""
          ></image>

          <view class="textBox">
            <view
              :style="{
                color: '#121212'
              }"
              >{{ $t('login.c9') }}</view
            >
            <view
              style="margin-top:25upx;color: #999;
    font-size: 12px;
}"
              >{{ $t('login.c10') }}</view
            >
          </view>
        </view>
      </view>

      <view class="mid1Item">
        <view
          class="item"
          @click="funsItemClick(20)"
        >
          <image
            class="image2"
            src="../../static/images/c2.png"
            mode=""
          ></image>

          <view class="textBox">
            <view
              :style="{
                color: '#121212'
              }"
              >DeFi</view
            >
            <view
              style="margin-top:25upx;color: #999;
    font-size: 12px;
}"
              >{{ $t('login.c16') }}</view
            >
          </view>
        </view>
      </view>
    </view> -->
    <!-- <view class="mid2">
      <view
        class="mid2Left"
        @click="funsItemClick(10)"
      >
        <image
          class="image5"
          src="../../static/images/c3.png"
          mode=""
        ></image>

        <view
          :style="{
            marginTop: '25upx',
            color: '#121212'
          }"
          >ICO</view
        >
        <view
          style="margin-top:25upx;color: #999;
    font-size: 12px;
}"
          >{{ $t('login.c12') }}</view
        >
      </view>

      <view class="mid2Right">
        <view
          class="item"
          @click="funsItemClick(20)"
        >
          <image
            class="image3"
            src="../../static/images/c2.png"
            mode=""
          ></image>

          <view class="textBox">
            <view
              :style="{
                color: '#121212'
              }"
              >DeFi</view
            >
            <view
              style="margin-top:25upx;color: #999;
    font-size: 12px;
}"
              >{{ $t('login.c16') }}</view
            >
          </view>
        </view>
        <view
          class="item"
          @click="funsItemClick(17)"
        >
          <image
            class="image3"
            src="../../static/images/c1.png"
            mode=""
          ></image>

          <view class="textBox">
            <view
              :style="{
                color: '#121212'
              }"
              >{{ $t('login.c9') }}</view
            >
            <view
              style="margin-top:25upx;color: #999;
    font-size: 12px;
}"
              >{{ $t('login.c10') }}</view
            >
          </view>
        </view>
      </view>
    </view> -->
	
	<view class="mid">	
		<view class="midRight">
			<view class="midRightItem"  :class="['flex','midRightTop',{'midRightItemBg':theme == 'dark'}]" @click="funsItemClick(16)">
				<image class="image2" src="../../static/images/c0.png" mode=""></image>
				<!-- <view>
					<view class="midRightText1">{{$t('login.c13')}}</view>
					<view class="midRightText2">{{$t('login.c14')}}</view>
				</view> -->
				<text class="midRightText1">{{$t('login.c13')}}</text>
				<text class="midRightText2">{{$t('login.c14')}}</text>
			</view>	
		</view>
	</view>
    <view :class="['listBox', 'funs', { darksss: theme == 'dark' }]">
      <scroll-view
        ref="tabbar1"
        id="tab-bar"
        class="tab-bar"
        :scroll="false"
        :scroll-x="true"
        :show-scrollbar="false"
      >
        <div class="c-table">
          <!-- <view class="c-item">
            <view class="">
              <view
                :class="['listTag1 listTagF', current == 0 ? 'listTagAcitve' : '']"
                @click="changeBang(0)"
                >{{ $t('login.c17') }}</view
              >
            </view>
          </view> -->
          <view class="c-item">
            <view class="">
              <view
                :class="['listTag2 listTagF', current == 1 ? 'listTagAcitve' : '']"
                @click="changeBang(1)"
                >{{ $t('login.c18') }}</view
              >
            </view>
          </view>
          <view class="c-item">
            <view class="">
              <view
                :class="['listTag3 listTagF', current == 2 ? 'listTagAcitve' : '']"
                @click="changeBang(2)"
                >{{ $t('login.c19') }}</view
              >
            </view>
          </view>
          <view class="c-item">
            <view class="">
              <view
                :class="['listTag3 listTagF', current == 3 ? 'listTagAcitve' : '']"
                @click="changeBang(3)"
                >{{ $t('home.favor') }}</view
              >
            </view>
          </view>
          <view class="c-item">
            <view class="">
              <view
                :class="['listTag3 listTagF', current == 4 ? 'listTagAcitve' : '']"
                @click="changeBang(4)"
                >{{ $t('home.updowns') }}</view
              >
            </view>
          </view>
          <view class="c-item">
            <view class="">
              <view
                :class="['listTag3 listTagF', current == 5 ? 'listTagAcitve' : '']"
                @click="changeBang(5)"
                >{{ $t('home.downdowns') }}</view
              >
            </view>
          </view>
        </div>
      </scroll-view>

      <!-- 加一条线 -->
      <u-line color="#5559691f"></u-line>
      <swiper
        class="tab-box"
        style="height: 1100rpx"
        ref="swiper1"
        :current="current"
        :duration="300"
        @change="onswiperchange"
        @animationfinish="animationfinish"
      >
        <!-- 币币指数 -->
        <swiper-item class="swiper-item">
          <view class="list">
            <view
              class="flex listItem"
              v-for="(item, i) in quoList"
              :key="i"
              @click="linkKline(current, item.symbol)"
            >
              <view class="itemLeft">
                <image
                  :src="item.img"
                  style="width: 8vw; height: 8vw; margin-right: 2vw; border-radius: 10vw"
                ></image>
                <view>
                  <view class="itemLeftView1">
                    {{ item.symbol.split('/')[0] }}<text>/{{ item.symbol.split('/')[1] }}</text>
                  </view>
                  <view class="itemLeftView2">vol:{{ item.high }}</view>
                </view>
              </view>

              <view :class="['itemRight']">
                <view class="itemCenter">
                  <view
                    :class="['itemCenterView1']"
                    :style="{
                      color: theme == 'dark' ? '#fff' : '#121212'
                    }"
                  >
                    ${{ item.close }}
                  </view>
                  <view
                    v-if="false"
                    class="itemLeftView2"
                    >≈ {{ item.cny }} CNY</view
                  >
                </view>
                <view
                  class="riseFall"
                  :class="[parseFloat(item.rose) < 0 ? 'orange' : 'green']"
                >
                  <image
                    class="fallDrastically1"
                    :src="
                      parseFloat(item.rose) < 0
                        ? '../../static/image/fallDrastically1.png'
                        : '../../static/image/fallDrastically2.png'
                    "
                  ></image>
                  {{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}%
                </view>
              </view>
            </view>
          </view>
        </swiper-item>
        <!-- 永续合约 -->
        <swiper-item class="swiper-item">
          <view class="list">
            <view
              class="flex listItem"
              v-for="(item, i) in recomList"
              :key="i"
              @click="linkKline(current, item.symbol)"
            >
              <view class="itemLeft">
                <image
                  :src="item.img"
                  style="width: 8vw; height: 8vw; margin-right: 2vw; border-radius: 10vw"
                ></image>
                <view>
                  <view class="itemLeftView1">
                    {{ item.symbol.split('/')[0] }}<text>/{{ item.symbol.split('/')[1] }}</text>
                  </view>
                  <view class="itemLeftView2">vol:{{ item.high }}</view>
                </view>
              </view>

              <view :class="['itemRight']">
                <view class="itemCenter">
                  <view
                    :class="['itemCenterView1']"
                    :style="{
                      color: theme == 'dark' ? '#fff' : '#121212'
                    }"
                  >
                    ${{ item.open }}
                  </view>
                  <view
                    v-if="false"
                    class="itemLeftView2"
                    >≈ {{ item.cny }} CNY</view
                  >
                </view>
                <view
                  class="riseFall"
                  :class="[parseFloat(item.rose) < 0 ? 'orange' : 'green']"
                >
                  <image
                    class="fallDrastically1"
                    :src="
                      parseFloat(item.rose) < 0
                        ? '../../static/image/fallDrastically1.png'
                        : '../../static/image/fallDrastically2.png'
                    "
                  ></image>
                  {{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}%
                </view>
              </view>
            </view>
          </view>
        </swiper-item>
        <!-- 期权合约 -->
        <swiper-item class="swiper-item">
          <view class="list">
            <view
              class="flex listItem"
              v-for="(item, i) in optionList"
              :key="i"
              @click="linkKline(current, item.symbol, item)"
            >
              <view class="itemLeft">
                <view class="itemLeftView1">
                  <!-- {{item.name}} --><text>{{ item.symbol }} {{ $t('bico.W691') }}</text>
                </view>
              </view>
              <view class="itemCenter"> </view>
              <view :class="['itemRight', parseFloat(item.rose) < 0 ? 'bt2' : 'bt1']">
                {{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}%
              </view>
            </view>
          </view>
        </swiper-item>
        <!-- 自选 -->
        <swiper-item class="swiper-item">
          <view class="list">
            <view
              class="flex listItem"
              v-for="(item, i) in favorList"
              :key="i"
              @click="linkKline(current, item.symbol)"
            >
              <view class="itemLeft">
                <image
                  :src="item.img"
                  style="width: 8vw; height: 8vw; margin-right: 2vw; border-radius: 10vw"
                ></image>
                <view>
                  <view class="itemLeftView1">
                    {{ item.symbol.split('/')[0] }}<text>/{{ item.symbol.split('/')[1] }}</text>
                  </view>
                  <view class="itemLeftView2">vol:{{ item.high }}</view>
                </view>
              </view>

              <view :class="['itemRight']">
                <view class="itemCenter">
                  <view
                    :class="['itemCenterView1']"
                    :style="{
                      color: theme == 'dark' ? '#fff' : '#121212'
                    }"
                  >
                    ${{ item.close }}
                  </view>
                  <view
                    v-if="false"
                    class="itemLeftView2"
                    >≈ {{ item.cny }} CNY</view
                  >
                </view>
                <view
                  class="riseFall"
                  :class="[parseFloat(item.rose) < 0 ? 'orange' : 'green']"
                >
                  <image
                    class="fallDrastically1"
                    :src="
                      parseFloat(item.rose) < 0
                        ? '../../static/image/fallDrastically1.png'
                        : '../../static/image/fallDrastically2.png'
                    "
                  ></image>
                  {{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}%
                </view>
              </view>
            </view>
          </view>
        </swiper-item>
        <!-- 币币涨幅榜 -->
        <swiper-item class="swiper-item">
          <view class="list">
            <view
              class="flex listItem"
              v-for="(item, i) in riseList"
              :key="i"
              @click="linkKline(current, item.symbol)"
            >
              <view class="itemLeft">
                <image
                  :src="item.img"
                  style="width: 8vw; height: 8vw; margin-right: 2vw; border-radius: 10vw"
                ></image>
                <view>
                  <view class="itemLeftView1">
                    {{ item.symbol.split('/')[0] }}<text>/{{ item.symbol.split('/')[1] }}</text>
                  </view>
                  <view class="itemLeftView2">vol:{{ item.high }}</view>
                </view>
              </view>
              <view :class="['itemRight']">
                <view class="itemCenter">
                  <view
                    :class="['itemCenterView1']"
                    :style="{
                      color: theme == 'dark' ? '#fff' : '#121212'
                    }"
                  >
                    ${{ item.close }}
                  </view>
                  <view
                    v-if="false"
                    class="itemLeftView2"
                    >≈ {{ item.cny }} CNY</view
                  >
                </view>
                <view
                  class="riseFall"
                  :class="[parseFloat(item.rose) < 0 ? 'orange' : 'green']"
                >
                  <image
                    class="fallDrastically1"
                    :src="
                      parseFloat(item.rose) < 0
                        ? '../../static/image/fallDrastically1.png'
                        : '../../static/image/fallDrastically2.png'
                    "
                  ></image>
                  {{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}%
                </view>
              </view>
            </view>
          </view>
        </swiper-item>
        <!-- 币币跌幅榜 -->
        <swiper-item class="swiper-item">
          <view class="list">
            <view
              class="flex listItem"
              v-for="(item, i) in riseDownList"
              :key="i"
              @click="linkKline(current, item.symbol)"
            >
              <view class="itemLeft">
                <image
                  :src="item.img"
                  style="width: 8vw; height: 8vw; margin-right: 2vw; border-radius: 10vw"
                ></image>
                <view>
                  <view class="itemLeftView1">
                    {{ item.symbol.split('/')[0] }}<text>/{{ item.symbol.split('/')[1] }}</text>
                  </view>
                  <view class="itemLeftView2">vol:{{ item.high }}</view>
                </view>
              </view>

              <view :class="['itemRight']">
                <view class="itemCenter">
                  <view
                    :class="['itemCenterView1']"
                    :style="{
                      color: theme == 'dark' ? '#fff' : '#121212'
                    }"
                  >
                    ${{ item.close }}
                  </view>
                  <view
                    v-if="false"
                    class="itemLeftView2"
                    >≈ {{ item.cny }} CNY</view
                  >
                </view>
                <view
                  class="riseFall"
                  :class="[parseFloat(item.rose) < 0 ? 'orange' : 'green']"
                >
                  <image
                    class="fallDrastically1"
                    :src="
                      parseFloat(item.rose) < 0
                        ? '../../static/image/fallDrastically1.png'
                        : '../../static/image/fallDrastically2.png'
                    "
                  ></image>
                  {{ parseFloat(item.rose) < 0 ? '' : '+' }}{{ (item.rose - 0) | toFixed2 }}%
                </view>
              </view>
            </view>
          </view>
        </swiper-item>
      </swiper>
      <u-popup
        v-model="passShow"
        mode="center"
        width="90%"
        height="25%"
        border-radius="10"
      >
        <view class="passbox">
          <span style="color: #000"> {{ $t('bico.W789') }}</span>
          <view class="input">
            <view>
              <input
                class="uni-input"
                cursor-spacing="0"
                :adjust-position="false"
                v-model="chatPassword"
                type="text"
                :placeholder="$t('bico.W792')"
              />
            </view>
          </view>
          <view class="btns">
            <view
              @click="
                chatPassword = '';
                passShow = false;
              "
              class="btn cancel"
              >{{ $t('bico.W18') }}</view
            >
            <view
              @click="checkChatPwd(chatPassword)"
              class="btn cancell"
              :class="chatPassword ? 'submit' : 'cancel'"
              >{{ $t('bico.W19') }}</view
            >
          </view>
        </view>
      </u-popup>
    </view>
  </view>
</template>

<script>
var socketInstance;
import { mapState, mapActions, mapGetters } from 'vuex';
import {
  commonNewsList,
  commonCarousel,
  commonContact,
  commonWeb3,
  commonNews,
  huobiTicket,
  optionSymbolInfo,
  favoriteInfo,
  info,
  wallet,
  logout,
  commonVersion,
  commonChatConfigs,
  checkChatPwd
} from '../../common/apiString.js';
import { checkUpdate } from '@/components/yzhua006-update/js/app-update-check.js';
export default {
  data() {
    return {
      mycontact: {},
      web3url: {},
      newsurl: {},
      homenews: '',
      eyesFlag: true,
      totalPrice: 0,
      incomeTotal: 0,
      isShowLayer: false,
      chatpng: [{ img: '../../static/chat.png' }],
      list: [
        {
          image: '../../static/purchase/1.png'
        },
        {
          image: '../../static/purchase/2.png'
        },
        {
          image: '../../static/purchase/3.png'
        },
        {
          image: '../../static/purchase/4.png'
        },
        {
          image: '../../static/purchase/5.png'
        },
        {
          image: '../../static/purchase/6.png'
        },
        {
          image: '../../static/purchase/7.png'
        },
        {
          image: '../../static/purchase/8.png'
        }
      ],

      indicatorLineLeft: 0,
      indicatorLineWidth: 0,
      isTap: 0,
      current: 0,
      swiperCurrent: 0,
      bannerList: [
		// {
		// 	carouselId:"93",
		// 	img:"http://166.88.61.152:8185//uploads/2024-12/8c897-70a8-496e-a.jpg",
		// 	language:"",
		// 	link:"http://23.230.108.83:8185/uploads/2024-7/62b29-19d8-40d1-9.jpg",
		// 	title:""
		// }
	  ],
      bannerMid: [],
      noticeList: [],
      quoList: [],
      favorList: [],
      riseList: [],
      riseDownList: [],
      optionList: [],
      recomList: [],
      title: 'Hello',
      showLeft: false,
      showMask: false,
      fingerBool: '0',
      token: '',
      isface: 0,
      info: '',
      head: '../../static/image/head.png',
      cny_rate: '',
      languages: {
        zh: {
          name: '中文',
          img: '/static/image/zh.png'
        },
        en: {
          name: 'English',
          img: '/static/image/en.png'
        },
        hk: {
          name: '繁體中文',
          img: '/static/image/hk.png'
        },
        jp: {
          name: '日本語',
          img: '/static/image/jp.png'
        }
      },
      tablist: [
        {
          id: 'tab00',
          name: '币币指数'
        },
        {
          id: 'tab01',
          name: '永续合约'
        },
        {
          id: 'tab02',
          name: '期权交易'
          //count: 5
        }
      ],
      lang: '',
      isshowlang: false,
      getList: null,
      ismore: false,
      chatPassword: '',
      passShow: false,
      needChatPwd: true,
      chatPwdFlag: false,
      chatName: '聊天室1',
      chatDesc: '聊天室描述1'
    };
  },
  computed: {
    ...mapState({
      theme: state => state.theme
    })
  },
  watch: {
    lod(val) {
      if (val) {
        this.getBannerImg();
        this.getNoticeList();
      }
    }
  },
  filters: {
    toFixed2: function (value, options) {
      value = Number(value);
      return value.toFixed(2);
    }
  },
  onLoad: function (option) {
    var token = uni.getStorageSync('token');
    this.lang = uni.getStorageSync('lang');
    if (option.icd) {
      console.log('invite_code' + option.icd);
      if (!uni.getStorageSync('invite_code')) {
        uni.setStorageSync('invite_code', option.icd);
      }
    }

    if (token) {
      this.getUserInfo();
    }
    uni.setNavigationBarTitle({
      title: this.$t('market.home')
    });
    this.getBannerImg();
    this.getNoticeList();
    this.contact();
    this.walletFun();
    this.$utils.initData(
      {
        url: commonNewsList,
        data: {
          language: 'top'
        },
        type: 'POST'
      },
      (res, msg) => {
        this.homenews = res.records;
        if (res.total > 0) {
          this.isShowLayer = true;
        }
      }
    );
  },
  beforeDestroy() {
    clearInterval(this.getList);
  },
  onHide() {
    //this.$socket.closeSocket(socketInstance);
    clearInterval(this.getList);
  },
  mounted() {
    this.showLeft = false;
    this.showMask = false;
    this.token = uni.getStorageSync('token');
    var that = this;
    // that.getList = setInterval(function() {
    // 	that.quotation();
    // }, 1000)

    this.getMkar(0);
    this.getMkar(1);
    //this.getMkar(2)
    this.fingerBool = uni.getStorageSync('fingerBool');

    this.changeFooter();
  },
  onShow() {
    var that = this;
    console.log(this.theme);
    if (this.theme == 'dark') {
      uni.setNavigationBarColor({
        frontColor: '#ffffff',
        backgroundColor: '#041525'
      });
    } else {
      uni.setNavigationBarColor({
        frontColor: '#000000',
        backgroundColor: '#3e38ec'
      });
    }
    this.getNoticeList();
    that.getList = setInterval(function () {
      that.quotation();
    }, 2000);
    that.getChatConfig();
    //这里可以适当延时执行
    // #ifdef APP-PLUS
    this.getAppInfo(0); //获取线上APP版本信息  参数type 0自动检查  1手动检查（手动检查时，之前取消更新的版本也会提示出来）
    // #endif
  },
  methods: {
    walletFun() {
      let that = this;
      let dto = {
        valuation: 'USDT',
        hide: 'N',
        type: 'WALLET'
      };

      this.$utils.initDataToken({ url: wallet, data: dto, type: 'get' }, (res, msg) => {
        var obj = res;
        that.incomeTotal = Number(obj.incomeTotal).toFixed(2);
        that.totalPrice = Number(obj.valuationTotalPrice).toFixed(2);
      });
    },
    changemore(flag) {
      this.ismore = flag;
    },
    getChatConfig() {
      var that = this;
      this.$utils.initData({ url: commonChatConfigs, type: 'post' }, (res, msg) => {
        that.chatName = res.chatName;
        that.chatDesc = res.chatDesc;
        that.needChatPwd = res.chatOpen == 'Y';
      });
    },
    checkChatPwd(pwd) {
      var that = this;
      that.$utils.initDataToken(
        { url: checkChatPwd, data: { pwd: pwd }, type: 'post' },
        (res, msg) => {
          that.funsItemClick(24);
        }
      );
    },
    showMid() {
      this.$utils.openoutherurl(this.bannerMid[0].link);
    },
    showChatModel() {
      if (this.needChatPwd) {
        this.passShow = true;
        if (this.chatPassword) {
          this.checkChatPwd(this.chatPassword);
          return;
        }
      } else {
        this.funsItemClick(24);
      }
      console.log(this.passShow);
    },
    bannerclick(e) {
      let url = this.bannerList[e].link;
      if (url.indexOf('starchainminer') != -1) {
        uni.navigateTo({
          url: '/pages/mstarch/mstarch'
        });
      } else if (url.indexOf('option') != -1) {
        uni.navigateTo({
          url: '/pages/Option/Option'
        });
      } else if (url.indexOf('transactionTrade') != -1) {
        uni.switchTab({
          url: '/pages/trade/trade'
        });
      } else if (url.indexOf('register') != -1) {
        uni.navigateTo({
          url: '/register'
        });
      } else if (url.indexOf('/#/') != -1) {
        uni.navigateTo({
          url: url.substring(3)
        });
      }
    },
    //获取线上APP版本信息
    getAppInfo(type) {
      const system_info = uni.getSystemInfoSync();
      let params = {
        os: system_info.platform //本机设备操作系统  （android || ios）
      };
      if (params.os != 'ios' && params.os != 'android') false; //如果不是安卓或ios 返回false
      //测试使用的是qqapk，上线清空
      var appUrl = '';
      //安卓
      var type = '';
      if (params.os == 'android') {
        type = 'ANDROID';
      }
      //苹果
      if (params.os == 'ios') {
        type = 'IOS';
      }
      //版本 ，后台版本控制，和本地uniapp版本对比，高于本都版本才会触发强制更新
      var myversion = '1.0.0';
      //这里自行请求API获取版本信息 建议传入操作系统标识，返回本机对应的操作系统最新版本信息，也就是安卓的返回就是安卓的版本信息  ios返回就是ios的版本信息
      this.$utils.initData(
        {
          url: commonVersion,
          data: {
            type: type
          },
          type: 'post'
        },
        (res, msg) => {
          myversion = res.version;
          appUrl = res.address;
          var t = res.content;
          //请求获取最新版本
          setTimeout(() => {
            let update_info = {
              version: myversion, //线上版本
              now_url: appUrl, //更新链接
              silent: 0, //是否是静默更新
              force: 1, //是否是强制更新
              net_check: 1, //非WIfi是否提示
              note: t //更新内容
            };
            checkUpdate(update_info, type).then(res => {
              if (res.msg) {
                //plus.nativeUI.toast(res.msg);
              }
            }); ///检查更新
            //checkUpdate 这个方法会做什么？：线上版本号 与 本地版本号做对比 ，如果需要更新  根据静默，强制、wifi等信息执行静默更新或跳转到升级页面
            //跳转升级页面的前提是，需要新建并在pages.json中配置升级页面，配置方法请查看插件详情
          }, 200);
        }
      );
    },
    showL(text) {
      this.$utils.showLayer(text);
    },
    linkKline(type, symbol, item) {
      uni.setStorageSync('klineSymbol', symbol);
      if (type == 0) {
        uni.switchTab({
          url: '/pages/trade/trade'
        });
      }
      if (type == 1) {
        uni.switchTab({
          url: '/pages/lever/lever'
        });
      }
      if (type == 2) {
        uni.navigateTo({
          url: '/pages/Option/Option?id=' + item.id //期权秒合约
        });
      }
      if (type == 3) {
        uni.switchTab({
          url: '/pages/tebbitt/tebbitt'
        });
      }
      if (type == 4) {
        uni.switchTab({
          url: '/pages/trade/trade'
        });
      }
      if (type == 5) {
        uni.switchTab({
          url: '/pages/trade/trade'
        });
      }
    },
    skip() {
      uni.navigateTo({
        url: '/pages/mine/lang' //语言选择
      });
    },
    gocontact() {
      // #ifdef APP
      //移动端
      plus.runtime.openURL(this.mycontact);
      // #endif
      //#ifdef H5
      //window.location.href = this.mycontact;
      //window.open(this.mycontact, '_blank');
      this.$utils.openoutherurl(this.mycontact);
      //#endif
    },
    goweb3() {
      // #ifdef APP
      //移动端
      plus.runtime.openURL(this.web3url);
      // #endif
      //#ifdef H5
      this.$utils.openoutherurl(this.web3url);
      //#endif
    },
    ontabtap(e) {
      let index = e.target.dataset.current || e.currentTarget.dataset.current;
      this.changeTab(index);
    },
    changeTab(index) {
      this.current = index;
    },
    toAdv() {
      uni.navigateTo({
        url: '/pages/neWs/neWs' //公告
      });
    },
    closeSocket() {
      this.$socket.closeSocket(socketInstance);
    },

    funsItemClick(index) {
		if (index == 1) {
		  uni.navigateTo({
		    url: '/pages/neWs/neWs' //公告
		  });
		}
		if (index == 2) {
		  uni.navigateTo({
		    url: '/pages/mine/security' //安全中心
		  });
		}
		if (index == 3) {
		  uni.navigateTo({
		    url: '/pages/assets/charge' //冲币
		  });
		}
		if (index == 4) {
		  uni.navigateTo({
		    url: '/pages/assets/mention' //提币
		  });
		} 
		if (index == 77) {
		  uni.navigateTo({
		    url: '/pages/assets/assets' //提币
		  });
		}
      if (index == 10) {
        uni.navigateTo({
          url: '/pages/ieo/ieo' //资产
        });
      }
      if (index == 11) {
        uni.navigateTo({
          url: '/pages/assets/transfer' //划转
        });
      }
      if (index == 12) {
        uni.navigateTo({
          //url: '/pages/assets/mention' //提币
          url: '/pages/otc/otc'
        });
      }
      if (index == 13) {
        uni.navigateTo({
          url: '/pages/assets/charge' //冲币
        });
      }

      if (index == 14) {
        uni.navigateTo({
          url: '/pages/Apply/Apply' //申请上币
        });
      }
      if (index == 15) {
        uni.navigateTo({
          url: '/pages/otc/otc' //法币交易
        });
      }
      if (index == 5) {
        uni.switchTab({
          url: '/pages/assets/assets'
        });
      }
      if (index == 16) {
        uni.navigateTo({
          url: '/pages/Option/Option' //期权秒合约
        });
      }
      if (index == 17) {
        uni.navigateTo({
          url: '/pages/business/business' //法币商家
        });
      }
      if (index == 18) {
        window.location.href = this.newsurl; //'https://www.investing.com/';

        /*uni.navigateTo({
						url: '/pages/share/share' //邀请好友
					})*/
      }
      if (index == 19) {
        uni.navigateTo({
          url: '/pages/financial/financial' //理财生息
        });
      }
      if (index == 20) {
        uni.navigateTo({
          url: '/pages/purchase/purchase' //新币认购
        });
      }
      if (index == 21) {
        uni.navigateTo({
          url: '/pages/StationPay/StationPay' //闪电转账
        });
      }
      if (index == 22) {
        uni.navigateTo({
          url: '/pages/mstarch/mstarch' //星链矿机
        });
      }
      if (index == 23) {
        uni.navigateTo({
          url: '/pages/Signin/Signin' //每日签到
        });
      }
      if (index == 24) {
        this.passShow = false;
        uni.navigateTo({
          url: '/pages/usreMei/chat' //聊天室
        });
      }
      if (index == 25) {
        uni.navigateTo({
          url: '/pages/assets/flash' //聊天室
        });
      }
      if (index == 26) {
        uni.navigateTo({
          url: '/pages/share/share' //邀请好友
        });
      }

      if (index == 27) {
        uni.navigateTo({
          url: '/pages/bzj/hehuoren' //合伙人
        });
      }
      if (index == 28) {
        uni.navigateTo({
          url: '/pages/bzj/bzj' //保证金
        });
      }
    },

    noOpen() {
      plus.nativeUI.toast('功能暂未开放！', {
        verticalAlign: 'center'
      });
    },

    // 切换夜间模式
    switchChange(e) {
      console.log(e.target.value);
      var ui = this.theme == 'light' ? 'dark' : 'light';
      uni.setStorageSync('theme', ui);
      this.$store.dispatch('changeTheme', ui);
      this.$utils.setTheme(ui);
      if (ui == 'dark') {
        uni.setTabBarStyle({
          color: '#a2a6a5',
          selectedColor: '#1881d2',
          backgroundColor: '#0f1a2d',
          borderStyle: 'white'
        });
      } else {
        uni.setTabBarStyle({
          color: '#8b97a0',
          selectedColor: '#238ee1',
          backgroundColor: '#ffffff',
          borderStyle: 'white'
        });
      }
    },
    uploadImg() {
      var that = this;
      uni.chooseImage({
        count: 1,
        // sizeType: ['original', 'compressed'],
        sizeType: ['compressed'],
        success: chooseImageRes => {
          const tempFilePaths = chooseImageRes.tempFilePaths;
          uni.uploadFile({
            url: '/api/upload', //仅为示例，非真实的接口地址
            // #ifdef APP-PLUS
            url: domain + '/api/upload',
            // #endif
            filePath: tempFilePaths[0],
            name: 'file',
            formData: {
              user: 'test'
            },
            success: uploadFileRes => {
              console.log(typeof uploadFileRes.data);
              var data = JSON.parse(uploadFileRes.data);
              if (data.type == 'ok') {
                let head = data.message;
                console.log(head);
                that.uphead(head);
              }
            }
          });
        }
      });
    },
    uphead(head) {
      let that = this;
      this.$utils.initDataToken(
        {
          url: 'user/head_pic',
          data: {
            head_portrait: head
          },
          type: 'post'
        },
        (res, msg) => {
          that.head = head;
        }
      );
    },
    changeFooter() {
      uni.setTabBarItem({
        index: 0,
        text: this.$t('tabBar.index')
      });
      uni.setTabBarItem({
        index: 1,
        text: this.$t('tabBar.business')
      });
      uni.setTabBarItem({
        index: 2,
        text: this.$t('tabBar.perpetual')
      });
      uni.setTabBarItem({
        index: 3,
        text: this.$t('tabBar.agreements')
      });
      uni.setTabBarItem({
        index: 4,
        text: this.$t('tabBar.mine')
      });
    },
    go() {
      uni.navigateTo({
        url: '/pages/mine/commission'
      });
    },
    // 语言切换
    changeLang(lang) {
      this.$utils.initData(
        {
          url: 'lang/set',
          data: {
            lang
          },
          type: 'POST'
        },
        res => {
          console.log(lang);
          this.lang = lang;
          uni.setStorageSync('lang', lang);
          this.$i18n.locale = lang;
          this.isshowlang = false;
          this.changeFooter();
          this.showLeft = false;
          this.showMask = false;
          this.token = uni.getStorageSync('token');
          this.getBannerImg();
          this.getNoticeList();
        }
      );
    },
    //轮播图
    getBannerImg() {
      this.$utils.initData(
        {
          url: commonCarousel,
          data: {
            c_id: 5
          },
          type: 'POST'
        },
        (res, msg) => {
          console.log(55555,res);
          uni.stopPullDownRefresh();
          this.bannerList = res;
        }
      );
      this.$utils.initData(
        {
          url: commonCarousel,
          data: {
            type: 'HOME_MID'
          },
          type: 'POST'
        },
        (res, msg) => {
          this.bannerMid = res;
        }
      );
      /*this.$utils.initData({
					url: commonCarousel,
					data: {
						type: "CHAT_JOIN"
					},
					type: 'POST'
				}, (res, msg) => {
					this.chatpng = res;
					
				})*/
    },
    //公告
    getNoticeList() {
      this.$utils.initData(
        {
          url: commonNewsList,
          data: {
            language: uni.getStorageSync('lang')
          },
          type: 'POST'
        },
        (res, msg) => {
          uni.stopPullDownRefresh();
          this.noticeList = res.records;
        }
      );
    },
    //行情交易对
    quotation() {
      let cur = 0;
      if (this.current == 4 || this.current == 5) {
        cur = 4;
      }
      if (this.current == 1) {
        cur = 1;
      }
      if (this.current == 3) {
        this.$utils.initDataToken(
          {
            url: favoriteInfo,
            type: 'get'
          },
          (res, msg) => {
            this.favorList = res;
          }
        );
        return true;
      }

      this.$utils.initData(
        {
          url: huobiTicket,
          data: {
            type: cur
          },
          type: 'post'
        },
        (res, msg) => {
          //uni.stopPullDownRefresh();
          let usdtData = res.find(item => item.name == 'USDT');
          this.cny_rate = !usdtData ? 6.9 : usdtData.fiat_convert_cny;
          res.sort(function (a, b) {
            return b.change - a.change;
          });
          if (this.current == 0) {
            this.quoList = res;
            console.log(this.quoList);
          } else if (this.current == 4) {
            this.riseList = res;
          } else if (this.current == 5) {
            this.riseDownList = res.reverse();
          } else {
            this.recomList = res;
          }
        }
      );
      // }
    },
    contact() {
      this.$utils.initData(
        {
          url: commonContact,
          type: 'post'
        },
        (res, msg) => {
          //uni.stopPullDownRefresh();
		  console.log(12344,res)
          this.mycontact = res;
        }
      );
      this.$utils.initData(
        {
          url: commonWeb3,
          type: 'post'
        },
        (res, msg) => {
          //uni.stopPullDownRefresh();
          this.web3url = res;
        }
      );
      this.$utils.initData(
        {
          url: commonNews,
          type: 'post'
        },
        (res, msg) => {
          //uni.stopPullDownRefresh();
          this.newsurl = res;
		  uni.setStorageSync('newsurl',this.newsurl)
        }
      );
    },
    onswiperchange(e) {
      // 注意：百度小程序会触发2次
      // #ifndef APP-PLUS || H5 || MP-WEIXIN || MP-QQ
      let index = e.target.current || e.detail.current;
      this.changeTab(index);
      // #endif
    },
    animationfinish(e) {
      // #ifdef APP-PLUS || H5 || MP-WEIXIN || MP-QQ
      let index = e.detail.current;
      this.changeTab(index);
      // #endif
    },
    changeBang(type) {
      if (this.current == type) {
        return;
      }
      this.current = type;
      this.getMkar(type);
    },
    getMkar(type) {
      if (type == 3) {
        //自选
        this.$utils.initDataToken(
          {
            url: favoriteInfo,
            type: 'get'
          },
          (res, msg) => {
            this.favorList = res;
          }
        );
      } else if (type == 2) {
        this.$utils.initDataToken(
          {
            url: optionSymbolInfo,
            type: 'get'
          },
          (res, msg) => {
            this.optionList = res.data;
          }
        );
      } else {
        this.$utils.initData(
          {
            url: huobiTicket,
            data: {
              type: type
            },
            type: 'post'
          },
          (res, msg) => {
            //uni.stopPullDownRefresh();
            //debugger
            if (type == 0) {
              this.quoList = res;
            }
            if (type == 1) {
              this.recomList = res;
            }
            if (type == 4) {
              this.riseList = res;
            }
            if (type == 5) {
              this.riseDownList = res.reverse();
            }
          }
        );
      }
    },

    show() {
      if (this.token) {
        this.getUserInfo();
      }
      this.showLeft = !this.showLeft;
    },
    hide() {
      console.log('guanbiyemian');
      this.showLeft = !this.showLeft;
    },
    stop() {},
    //获取用户信息
    getUserInfo() {
      var that = this;
      this.$utils.initDataToken(
        {
          url: info,
          data: {},
          type: 'POST'
        },
        (res, msg) => {
          uni.stopPullDownRefresh();
          uni.setStorageSync('uid', msg.id);
          that.info = res;
          if (res.head_portrait) {
            that.head = res.head_portrait;
          }
        }
      );
    },
    //退出登录
    logout() {
      this.$utils.initDataToken(
        {
          url: logout,
          data: {},
          type: 'POST'
        },
        (res, msg) => {
          this.$utils.clearStorageSync();

          setTimeout(() => {
            this.$utils.showLayer(msg);
          }, 100);
          uni.redirectTo({
            url: '/pages/login/login'
          });
        }
      );
    }
  },
  onPullDownRefresh() {
    this.getBannerImg();
    this.getNoticeList();
    this.quotation();
  }
};
</script>
<style scoped>
.logoTitle {
  font-size: 48upx;
  font-weight: bold;
}
.c-table {
  display: flex;
}
.c-item {
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  flex: 1;
  font-size: 0;
  text-align: center;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.passbox {
  position: inherit;
  background: #fff;
  display: flex;
  flex-direction: column;
  padding: 30px 15px;
  font-size: 14px;
  border-radius: 2vw;
}

.input {
  line-height: 1.8;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 14upx 10upx;
  margin: 20upx 0;
  border: 0.5px solid #b2b9deab;
  border-radius: 4px;
}
/deep/ .input .uni-input .uni-input-input {
  color: #333 !important;
}
.btns {
  line-height: 1.8;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  padding: 16px 70px;
}
.btn {
  display: block;
  width: 40%;
  height: 70upx;
  line-height: 70upx;
  text-align: center;
  color: #fff;
  border-radius: 0;
  font-size: 28upx;
  border-radius: 4px;
}

.cancel {
  background: #2979ff;
}

.submit {
  background: #0952c3;
}
.top1 {
  padding: 8vw 20px 4vw;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1;
  background-color: #fff;
}
.wrap2 {
  padding: 0vw;
}
.flex {
  display: flex;
  align-items: center;
}

.itemLeftView1 {
  font-size: 14px;
  font-weight: 400;
  font-family: Times New Roman, Times, serif;
}

.itemLeftView1 > text {
  font-size: 14px;
  font-weight: 400;
}

.itemLeft {
  display: flex;
  align-items: center;
  justify-content: center;
}

.itemCenter {
  flex: 1;
}

.itemCenterView1 {
  font-size: 32upx;
  font-weight: 600;
  text-align: right;
}

.itemLeftView2 {
  padding-top: 10rpx;
  font-size: 12px;
  color: #999;
}

.itemRight {
  font-weight: 600;
  color: #fff;
  border-radius: 4px;
  padding: 14rpx 7upx;
  font-size: 14px;
}

.bt1 {
  background-color: #12b886;
}

.bt2 {
  background-color: #cd3d58;
}

.listItem {
  padding: 16rpx 0;
  border-bottom: solid 0vw #5559690f;
  justify-content: space-between;
}
.riseFall {
  margin-top: 10upx;
  justify-content: flex-end;
  font-size: 24upx;
  display: flex;
  align-items: center;
}
.list {
  padding: 0rpx 0;
}

.listTag2 {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  flex: 1;
  font-size: 14px;
  font-weight: 400;
}

.listTag2 {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  flex: 1;
  font-size: 14px;
  font-weight: 400;
}

.listTag3 {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  flex: 1;
  text-align: right;
  font-size: 14px;
  font-weight: 400;
}
.listTagAcitve {
  border-bottom: solid 0px #007aff;
  font-size: 14px;
  font-weight: 400;
  color: #007aff;
}
.listTagF {
  font-weight: bold;
  font-size: 12px;
}
.listBox {
  padding: 0vw 2vw;
  background-color: #fff;
  width: 98%;
  margin: 0 auto 0vw auto;
  border-radius: 0.5vw;
}
.bgtxt1 {
  position: relative;
  border: 0;
  overflow: visible;
  display: flex;
  flex-direction: row;
  align-items: center;
  z-index: 1;
  transition: all 0.15s;
  height: 30px;
  line-height: 30px;
  width: 21vw;
  position: relative;
  left: -1vw;
}
.bgtxt2 {
  position: relative;
  left: 7vw;
}

.bgtxt3 {
  position: relative;
  left: 15vw;
}

.bgtxt4 {
  position: relative;
  left: 4vw;
}

.bot {
  padding: 1vw 1vw 0vw;
}

.botBox {
  width: 100%;
  justify-content: space-around;
  background-color: #fff;
  border-radius: 0.5vw;
  height: 16vw;
}

.botBoxItem {
  padding: 0 0;
  text-align: center;
}

.botBoxItem > view {
  margin-top: 10upx;
  padding-top: 0px;
  font-weight: 400;
  font-size: 12px;
}

.mid {
  justify-content: space-between;
}

/* .boundaryLine{
		width: 752upx;
        height: 16upx;
        background: #F9F7F2;
	} */

.tab-bar-line {
  height: 1px;
  background-color: #cccccc;
}

.tab-box {
  flex: 1;
}

.uni-tab-item {
  /* #ifndef APP-PLUS */
  display: inline-block;
  /* #endif */
  flex-wrap: nowrap;
  padding-left: 20px;
  padding-right: 10px;
}

.uni-tab-item-title {
  color: #555;
  font-size: 15px;
  height: 40px;
  line-height: 40px;
  flex-wrap: nowrap;
  /* #ifndef APP-PLUS */
  white-space: nowrap;
  /* #endif */
}

.uni-tab-item-title-active {
  color: #007aff;
}

.midLeft {
  width: 49.4%;
  padding: 3vw 0 4vw 2vw;
  text-align: center;
  background-color: #fff;
  border-radius: 0.5vw;
}

.midLeftText1 {
  font-weight: 400;
  font-size: 14px;
}

.midLeftText2 {
  color: #999;
}

.midRight {
  width: 99%;
}
.midRightItem{
	border-radius: 15px !important; 
	margin: 10px 20px !important; 
}
.midRightItemBg{
	background-color: #222C49 !important;
	padding: 2.2vw 0 2.2vw 6vw;
	border-radius: 0.5vw;
}

.midRightTop{
	background-color: #f2f2f2; 
	padding: 2.2vw 0 2.2vw 6vw;
	border-radius: 0.5vw;
}
.midRightBottom {
  padding: 2.2vw 0 2.2vw 6vw;
  
  border-radius: 0.5vw;
}

.midRightTop {
  margin-bottom: 1vw;
}
.image1 {
  width: 14vw;
  height: 14vw;
  border-radius: 0%;
}

.image2 {
  width: 10vw;
  height: 10vw;
  border-radius: 0%;
  /* transform: translateX(); */
}
.image5 {
  width: 14vw;
  height: 14vw;
  border-radius: 0%;
}

.image3 {
  margin-right: 6vw;
  width: 10vw;
  height: 10vw;
  border-radius: 0%;
}

.midRightText1 {
  font-size: 14px;
  font-weight: 400;
  margin: 0 60rpx;
}

.midRightText2 {
  /* color: #999; */
  margin-right: 20rpx;
  font-size: 12px;
}

.red {
  color: red;
}

.green {
  color: #27af82;
}

.container {
  min-height: 100%;
  background-color: #fff;
}

.top {
  padding: 50px 20px 15px;
  background-color: #ffffff;
}

.t1 {
  padding: 0vw 0vw;
  justify-content: space-between;
}

.t2 {
  padding-top: 7.5vw;
}

.t1left > image {
  margin-right: 2vw;
  width: 6vw;
  height: 6vw;
}

.t1left > view {
  font-weight: 700;
  font-size: 4vw;
  position: relative;
  top: 12px;
  left: 0vw;
}

.t1right {
  display: grid;
  align-content: space-between;
}

.t1right > view {
  font-weight: 700;
  font-size: 4vw;
  position: relative;
  /*top: 12px;*/
  padding-right: 2vw;
}

.icon-xiaoxi2,
.icon-search {
  font-size: 14px;
  color: #666;
  font-weight: 400;
  margin-left: 30rpx;
}

.swiper-item {
  height: 150rpx;
  /* background-color: #ddd;
		color: red; */
  border-radius: 1vw;
  overflow: auto;
}

.swiper-item > image {
  width: 100%;
  height: 150rpx;
}

.t3 {
  margin: 4vw 0 0;
  /* justify-content: space-between; */
  overflow: auto;
}
.tf3 {
  background-image: linear-gradient(to bottom right, #000f61, #020723);
  border-radius: 4px;
}

.t3Item {
  display: flex;
  justify-content: space-between;
}

/* .t3ItemLeft{

	}
	.t3ItemCenter{

	}
	.t3ItemRight{

	} */
.t3ItemSymbol {
  font-size: 14px;
  font-weight: 400;
  padding: 1vw 0;
  width: 40vw;
  font-family: Times New Roman, Times, serif;
  display: flex;
  align-items: center;
}

.fallDrastically {
  width: 48upx;
  height: 48upx;
  margin: 0 5upx 0 10upx;
}

.fallDrastically1 {
  width: 32upx;
  height: 32upx;
  margin: 0 5upx 0 10upx;
}
.t3ItemLeft .right {
  display: flex;
  align-items: center;
  justify-content: center;
}
.t3ItemLeft .right image {
  width: 80upx;
  height: 80upx;
}
.t3ItemM1 {
  font-size: 14px;
  padding: 1vw 0;
  font-weight: bold;
}

.t3ItemM2 {
  font-size: 28upx;
  padding: 1vw 1vw;
}

.t3ItemM3 {
  font-size: 12px;
  padding: 0.5vw 0;
  color: #999999;
}

.lind {
  margin-top: 0vw;
}

.lindBox {
  padding: 2vw 1vw;
  width: 100%;

  border-bottom: solid 0.5px #36373e36;
  border-radius: 0vw;
  height: 10vw;
}

.lindText {
  font-size: 14px;
  padding-left: 4vw;
  height: 16px;
  font-weight: 400;
}

.wt20_h20 {
  width: 7vw;
  height: 5vw;
}

.wt20_h200 {
  width: 5.3vw;
  height: 5.3vw;
}

.wtr0_lin {
  width: 9vw;
  font-size: 14px;
  font-weight: 400;
  color: #2196f3;
}

.flex_image222 {
  width: 7.5vw;
  height: 7.5vw;
  border-radius: 0%;
  position: relative;
  top: 1vw;
}

.grid-text {
  font-size: 24rpx;
  margin-top: 4rpx;
  color: $u-type-info;
}

.grid-text {
  margin-top: 1vw;
  font-weight: bold;
  font-size: 3vw;
}

.grid-text {
  font-size: 24rpx;
  margin-top: 4rpx;
  color: $u-type-info;
}

.swiper {
  height: 150rpx;
}

.indicator-dots {
  margin-top: 40rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}

.indicator-dots-item {
  background-color: $u-tips-color;
  height: 6px;
  width: 6px;
  border-radius: 10px;
  margin: 0 3px;
}

.indicator-dots-active {
  background-color: $u-type-primary;
}
.flex_image2 {
  width: 6.4vw;
  height: 6.4vw;
  border-radius: 0%;
  position: relative;
  top: 0vw;
}
.flex_image22 {
  width: 7vw;
  height: 5.5vw;
  border-radius: 0%;
  position: relative;
  top: 0vw;
}

.flex_image23 {
  width: 8vw;
  height: 8vw;
  border-radius: 0%;
  position: relative;
  top: 0vw;
  right: 15upx;
}
.tab-bar {
  padding: 4vw 0vw;
}

.flex_image3 {
  width: 6vw;
  height: 6vw;
  border-radius: 50%;
  position: relative;
  /*top: 2.5vw;*/
}

.flex_image4 {
  width: 6vw;
  height: 6vw;
  border-radius: 50%;
  position: relative;
  /*top: 1vw;*/
  left: 0vw;
}
.toptf {
  padding: 2vw 0vw 0vw;
}
.tvngp {
  position: relative;
  left: 7vw;
}
.t1center > view {
  padding: 10rpx;
  font-weight: 900;
  font-size: 30rpx;
}
.t1center {
  color: black;
  border: solid 0.5px black;
  border-radius: 20rpx;
  background-color: gray;
}
.t1center .webname {
  background-color: white;
  border-radius: 20rpx;
}
.dark .t1center {
  color: black;
  border: solid 0.5px black;
  border-radius: 20rpx;
  background-color: gray;
}
.dark .t1center .webname {
  background-color: white;
  border-radius: 20rpx;
}
.totalViewTop {
  margin-top: 4vh;
}
.totalView {
  display: flex;
  align-items: center;
  margin-top: 20upx;
}
.totalView .totalText {
  color: #979ca6;
}
.icon-yanjing2 {
  margin-left: 20rpx;
  font-size: 24rpx;
}
.icon-yanjing3 {
  margin-left: 20rpx;
  font-size: 36rpx;
}
.btnview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.bbtn {
  width: 326upx;
  display: flex;
  height: 110upx;
  text-align: center;
  font-size: 28upx;
  border-radius: 30upx;
  padding: 7px 0;
  justify-content: center;
  align-items: center;
}
.flex_image24 {
  width: 40upx;
  height: 40upx;
  margin-right: 10upx;
}

.bbtn1 {
  background: #4fcf6b;
}
.bbtn2 {
  background: #724ed8;
}

.bbtn .flex_image22 {
  margin-right: 30upx;
}
.botalNumView1 text {
  padding-right: 20upx;
  display: flex;
  justify-content: center;
  align-items: center;
}

.botalNumView1 .today {
  background: #fbf4e2;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 8upx 16upx 8upx 16upx;
  border-radius: 12upx;
  font-weight: bold;
  color: #121212;
}
.botalNumView2 {
  font-size: 80upx;
  font-weight: bold;
}
.popularTitle {
  margin-top: 40upx;
  font-size: 36upx;
  font-weight: bold;
}

.popular {
  height: 430upx;
  overflow: scroll;
}

.orange {
  color: #ff5f49;
  font-weight: bold;
}

.green {
  color: #4fcf6b;
  font-weight: bold;
}

.mid2 {
  display: flex;
  justify-content: space-between;
  padding: 20upx 40upx;
}

.mid2 .mid2Left {
  width: 326upx;
  height: 340upx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #f2f2f2;
  border-radius: 32upx;
}
.mid2 .mid2Right {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.mid2 .mid2Right .item {
  width: 326upx;
  height: 152upx;
  background: #f2f2f2;
  border-radius: 32upx;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>

<style>
uni-swiper {
  height: 150rpx;
}
</style>
